<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css" />
    <script src="../js/jquery.min.js" ></script>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="../plugins/elementui/index.css">
    <link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="../css/style.css">
    <!-- 引入组件库 -->
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script src="../js/vue.js"></script>
    <script src="../plugins/elementui/index.js"></script>
    <script src="../js/axios-0.18.0.js"></script>
    <!-- 加载地图JSAPI脚本 -->
    <script src="https://webapi.amap.com/maps?v=1.4.15&key=67378ca8c958b136d6b51c01142619d5"></script>
    <title>地图显示</title>
    <style>
        html,
        body,
        #container {
            width: 100%;
            height: 95%;
        }
    </style>
</head>
<body>
<div id="container" @click="addMarker()">
</div><br/>
<span id="span" >qqq</span>
<script>
    var map = new AMap.Map('container', {
        resizeEnable: true, //是否监控地图容器尺寸变化
        zoom:21, //初始化地图层级
        center: [117.08129782889173, 36.67184993697183] //初始化地图中心点
    });
    var marker;
    var cpoint;
    var xx;
    var yy;

    map.on('click', function(e) {
        xx=e.lnglat.getLng();
        yy=e.lnglat.getLat();
        addMarker();
    });
    // 将创建的点标记添加到已有的地图实例：

    function addMarker() {
        clearMarker();
        var center =map.getCenter();
        marker = new AMap.Marker({
            position: new AMap.LngLat(xx, yy),   // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
        });

        map.add(marker);
        alert(xx+","+yy)

    };
    function clearMarker() {

        if (marker) {
            marker.setMap(null);
            marker = null;
        }
    };
</script>
</body>
</html>